<template>
  <div class="users">
    <p>{{ username }}</p>
    <p>{{ userFirstName }}</p>
    <van-button type="primary" @click="handleBack">back</van-button>
    <img src="" alt="" />
  </div>
</template>

<script>
import { mapState, mapGetters, mapMutations, mapActions } from "vuex";
import { Button } from "vant";

export default {
  name: "UsersManage",
  components: {
    [Button.name]: Button,
  },
  computed: {
    ...mapState("users", ["username"]),
    ...mapGetters("users", ["userFirstName"]),
  },
  methods: {
    ...mapMutations("users", ["saveUsername"]),
    ...mapActions("users", ["fetchUsername"]),
    handleBack() {
      this.$router.back();
    },
  },
};
</script>

<style scoped></style>
